<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>穿梭框</title>
		<script src="../js/jquery-3.1.1.min.js"></script>
		<script type="text/javascript" src="../js/layui/layui.js"></script>
		<link rel="stylesheet" type="text/css" href="../js/layui/css/layui.css" />
	</head>
	<body>
		<!-- 穿梭框给设置用户角色 -->
		<div>
			<div id="test1" class="demo-transfer"></div>
			
		</div>
		<div id="test2" class="demo-transfer"></div>
		
		
	<script type="text/javascript">
		var globalUrl = window.localStorage.getItem("globalUrl");
		var token = window.localStorage.getItem("token");
		var tableObj,index,uindex;
		layui.use(['element','transfer','util','layer','laydate','form','table'],function(){
				var element = layui.element;
				var $ = layui.jquery;
				var transfer = layui.transfer;
				var util = layui.util;
				var form = layui.form;
				var layer = layui.layer;
				var table = layui.table;
		
		function(obj){
			var data = obj.data;
			var uid = data.Id;
		//求所有角色
		$.ajax({
			url:globalUrl+"/api/GetRolesAll",
			data:{
				token:token
			},
			dataType:"json",
			type:"post",
			success:function(res){
				transfer.render({
				  elem: '#test1',
				  //解析数据格式
				  parseData: function(res){
				        return {
				          "value": res.Id //ID
				          ,"title": res.Name //角色名
				        }
				      },
				  height:369, //定义高度
				  showSearch: true,
				  data: res
				  //value:["1","2","3"]
				})
			}
		})
		//获取当前用户角色
		table.render({
		  elem: '#showroles'
		  ,toolbar: '#toolbarDemo'
		  ,url:globalUrl+'/api/GetRolesByUserIdLayUI'
		  ,method:'post'
		  ,where:{
			 uid:uid,
			token:token
			}
		  ,title: '用户数据表'
		  ,cols: [[
		    {type: 'checkbox', fixed: 'left'}
		    ,{field:'Id', title:'ID', fixed: 'left', unresize: true, sort: true}
		    ,{field:'Name', title:'用户名', sort: true}
		  ]]
		  ,page: true
		});
		}
		})
	</script>
	</body>
</html>
